
import React from 'react'
import { connect }  from 'react-redux';

class BillLineRemark extends React.Component {
  constructor(props) {
    super(props)

    this.state = {
      data: {}
    }
  }

  componentDidMount() {
    this.$unitList = $(ReactDOM.findDOMNode(this.refs.unitLists));
  }

  componentWillReceiveProps(props) {
    this.setState({
      data: props.remark,
      lineData: props.lineData
    })
  }

  componentDidUpdate() {
    // console.log(this.state.lineData)
  }

  onDataSubmit() {
    if (confirm("确认已支付吗?")) {
      var data = this.state.data;
      var billLine = this.state.lineData;
      billLine.remark = data+"";
      billLine.is_pay = true;
      billLine.pay_date = new Date()
      this.props.onBillLinePay(billLine);
      this.setState({
        data: ""
      })
    }
  }


  onChange(event) {
    console.log($(event.target).val())
    this.setState({
      data: $(event.target).val()
    })
  }


  renderFooter() {
    if (!this.props.isEdit) {
      return ""
    }
    else {
      return (<div className="modal-footer">
        <button type="button" className="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" className="btn btn-primary"
              onClick={(event)=> this.onDataSubmit()}>保存</button>
      </div>)
    }
  }


  render() {
    var self = this;

    return (
      <div className="modal fade" id="BillSettingEdit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div className="modal-dialog" role="document">
          <div className="modal-content">
            <div className="modal-header">
              <button type="button" className="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 className="modal-title" id="bill-modal-label">备注</h4>
            </div>
            <div className="modal-body">

              <div className="form-group">
                <label for="bill-year">备注</label>
                <textarea ref="MessageKeyWord" className="form-control textarea_input"
                           id="area" rows="10" onChange={(event)=>this.onChange(event)}
                           value = {self.state.data}></textarea>
              </div>

            </div>
            {self.renderFooter()}
          </div>
        </div>
      </div>
    )
  }
}


export default BillLineRemark;
